
@import '../styles/theme.less';
.mescroll-totop{
            z-index: 9990;
            position: fixed;
            right: 10px;
            bottom: 1rem !important;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            opacity: 0;
        }
.find-index{
    .totop{
        position: fixed;
        z-index: 16;
        bottom: 1.3rem;
        right: .3rem;
        width: .7rem;
        height: .7rem;
        background: #FFFFFF;
        border-radius: .7rem;
    }
    .mescroll-upwarp {
        padding-bottom: 1rem;
    }
  .swiper{
    margin-top: .3rem;
    .swiper-img{
      .padding-box{
        padding: 0 .3rem;
        height: 2rem;
        &.min{
          height: 1.5rem;
        }
        img{
          width: 100%;
          border-radius: .1rem;
          overflow: hidden;
          height: 100%;
        }
      }
    }
  }
  .hot{
    width: 7.1rem;
    margin-left: -0.2rem;
    .hot-goods{
      margin-top: .3rem;
      .hot-item{
        width: 3.35rem;
        height: 5.2rem;
        float: left;
        margin-left: .2rem;
        position: relative;
        .labs{
          position: absolute;
          top: .1rem;
          right: .1rem;
          z-index: 9;
              span {
              border-radius: .08rem;
              height: .3rem;
              font-size: .2rem;
              color: #fff;
              padding: .04rem .04rem;
              margin-right: .06rem;
            }
        }
        .img-box{
          width: 3.35rem;
          height: 3.35rem;
          img{
            width: 100%;
            height: 100%;
            border-radius: .1rem;
          }
        }
        .info-box{
          padding: .2rem 0;
          height: 100%;
          .title{
            &:extend(.ecs);
            font-family: @font-rl;
            font-size: 0.24rem;
            margin: 0;
            height: .4rem;
            line-height: .4rem;
            width: 100%;
            text-align: center;
            padding: 0;
            color: #464646;
          }
          .goods-content{
            height: 100%;
            text-align: center;
            label{
              margin: 0;
              padding: 0;
              font-family: @font-rl;
              font-size: .24rem;
              height: .5rem;
              line-height: .5rem;
              color: #464646;
              &:extend(.ecs);
            }
            .price-box{
            font-family: PingFangSC-Regular;
            font-size: .2rem;
            color: #909090;
            height: .3rem;
            line-height: .3rem;
            .price{
              color: #464646;
              font-size: .24rem;
              font-weight: bold;
            }
          }
          .base-price{
            font-family: @font-rl;
            font-size: .16rem;
            color: #909090;
            .base-price-span{
              color: #FF4C5D;
              font-size: .2rem;
            }
          }
          }
        }
      }
    }
  }
  .recomment{
    .img-box{
      margin-top: .3rem;
      height: 2rem;
      img{
        width: 100%;
        height: 100%;
        border-radius: .1rem;
      }
    }
    .row-2{
      margin-top: .3rem;
       li{
         width: 3.35rem;
         float: left;
         img{
           width: 100%;
           height: 100%;
           border-radius: .1rem;
         }
       }
    }
  }
  .preference{
    .goods-box{
      margin-top: .3rem;
      overflow-x: auto;
      overflow-y: hidden;
      .goods-item{
        width: 2.38rem;
        height: 3.48rem;
        display: inline-block;
        margin-left: .3rem;
        position: relative;
        .labs{
          position: absolute;
          top: .01rem;
          right: .01rem;
          z-index: 9;
              span {
              border-radius: .08rem;
              height: .3rem;
              font-size: .15rem;
              color: #fff;
              padding: .04rem .04rem;
              margin-right: .06rem;
            }
        }
        .img-box{
          height: 2rem;
          width: 2rem;
          margin-left: .19rem;
          img{
            width: 100%;
            height: 100%;
            border-radius: .1rem;
          }
        }
        .goods-content{
          height: 100%;
          text-align: center;
          label{
            margin: 0;
            padding: 0;
            font-family: @font-rl;
            font-size: .24rem;
            height: .5rem;
            line-height: .5rem;
            color: #464646;
            &:extend(.ecs);
          }
          .price-box{
            font-family: PingFangSC-Regular;
            font-size: .2rem;
            color: #909090;
            height: .3rem;
            line-height: .3rem;
            .price{
              color: #464646;
              font-size: .24rem;
              font-weight: bold;
            }
          }
          .base-price{
            font-family: @font-rl;
            font-size: .16rem;
            color: #909090;
            .base-price-span{
              color: #FF4C5D;
              font-size: .2rem;
            }
          }
        }
      }
      .goods-warp{
        width: 800px;
        white-space: nowrap;
      }
      .ecs{
              display: -webkit-box !important;
              white-space: normal;
      }
    }
    &.find-box{
      padding: 0;
    }
    label{
      padding: 0 .3rem;
      display: block;
      box-sizing: border-box;
    }
  }
  .find-box{
    margin-top: .5rem;
    &:extend(.hb-content);
    overflow: hidden;
    label{
      font-family: @font-mp;
      font-size: .32rem;
      color: #464646;
      .more{
        float: right;
        font-family: @font-rl;
        font-size: .28rem;
        color: #BCBCBC;
        &::after{
          content: " ";
          background-image: url('https://zafgoos.oss-cn-shanghai.aliyuncs.com/hbplus/imgs-h5/find-row-r.png');
          background-size: 100%;
          width: .1rem;
          display: inline-block;
          height: .2rem;
        }
      }
    }
    .find-item{
      margin-top: .3rem;
      img{
        width: 100%;
        height: 100%;
        border-radius: .1rem;
      }
    }
    ul{
      overflow: hidden;
    }
    .row-2 {
      li{
        float: left;
        width: 3.35rem;
        .img-box{
          margin-top: .3rem;
          img{
            width: 100%;
            height: 100%;
            border-radius: .1rem;
          }
        }
        &:last-child{
          margin-left: .2rem;
        }
      }
    }
    .row-thr{
      margin-top: .3rem;
      li{
        width: 1.57rem;
        height: 1.5rem;
        float: left;
        margin-left: .2rem;
        &:first-child{
          margin-left: 0;
        }
        .img-box{
          img{
            width: 100%;
            height: 100%;
            border-radius: .1rem;
          }
        }
      }
    }
  }
  .vux-icon-dot{
    width: .08rem !important;
    height: .08rem !important;
    border-radius: .04rem !important;
    background-color: rgba(255,255,255,0.5) !important;
  }
  .vux-icon-dot.active{
    width: .3rem !important;
  }
  .hb-find-card{
    height: 1.16rem;
    border-radius: 0.1rem;
    margin: 0 .3rem;
    margin-top: .18rem;
    background-image: url('https://zafgoos.oss-cn-shanghai.aliyuncs.com/hbplus/imgs/limit.png');
    background-size: 100%;
    padding: .21rem .3rem;
    box-sizing: border-box;
    li{
      float: left;
      color: #FFFFFF;
      font-family: @font-rl;
      letter-spacing: 0;
      .title{
        font-size: .28rem;
      }
      .info{
        font-size: .2rem;
        color: rgba(255,255,255,0.60);
      }
      .creding{
        font-size: .28rem;
        color: #FF8400;
        height: 100%;
        line-height: .7rem;
        display: block;
        text-shadow: 0 0 .1rem #000000;
      }
      .lable{
        font-size: .22rem;
        text-shadow: 0 0 .1rem #000000;
        text-align: right;
      }
      .price{
        font-size: .28rem;
        color: @app-color;
        font-family: @font-sb;
        text-align: right;
        letter-spacing: 1px;
      }
      .credit{
        width: 1.2rem;
        font-family: @font-rl;
        font-size: .22rem;
        color: #FFFFFF;
        display: inline-block;
        float: left;
        margin-top: -0.01rem;
        text-shadow: 0 0 .1rem #000000;
        span{
          line-height: .3rem;
          display: inline-block;
          border-bottom: .1rem solid rgba(0,0,0,0);
        }
      }
      .go-credit{
        padding: .2rem .3rem;
        float: right;
        font-family:@font-rl;
        font-size: .22rem;
        color: #464646;
        background: #FBC200;
        border-radius: .08rem;
      }
      &.find-card-r{
        float: right;
      }
    }
  }
  .hb-find-sh{
    height: .88rem;
    background-color: #fff;
    padding: .19rem .3rem;
    box-sizing: border-box;
    .find-sh-one{
      height: 100%;
      img{
        width: .42rem;
        float: left;
        height: .5rem;
      }
      .sh-center{
        margin-left: .3rem;
        width: 5.4rem;
        height: .5rem;
        border-radius: .25rem;
        display: inline-block;
        background-color: @line-color;
        position: relative;
        padding-left: .62rem;
        box-sizing: border-box;
        line-height: .5rem;
        float: left;
        font-family: @font-rl;
        font-size: .28rem;
        color: #BCBCBC;
        &::before{
          content: ' ';
          background-image: url('https://zafgoos.oss-cn-shanghai.aliyuncs.com/hbplus/imgs/searchIcon.png');
          background-size: 100%;
          width: .25rem;
          display: inline-block;
          position: absolute;
          left: .26rem;
          top: .12rem;
          height: .25rem;
        }
      }
      .sh-msg{
        width: .48rem;
        height: .5rem;
        display: inline-block;
        float: right;
        position: relative;
        padding: .06rem 0rem 0 .05rem;
        img{
          width: .38rem;
          height: .38rem;
        }
        .tip-num{
          position: absolute;
          width: .56rem;
          height: .56rem;
          background-color: @app-color-x;
          text-align: center;
          transform: scale(.5);
          line-height: .56rem;
          top: -0.18rem;
          right: -0.18rem;
          border: .05rem solid #fff;
          font-family: @font-sb;
          font-size: .28rem;
          color: #FFFFFF;
          border-radius: 100%;
          letter-spacing: 0;
        }
      }
    }
  }
}
